import { dom } from "../tool";

interface PropType {
    disabled?: boolean;
    child: string | HTMLElement;
    type?: 'primary' | 'text' | 'link' | 'default';
    onClick?: (event: MouseEvent) => any;
    className?: string;
    style?: any;
    target?: HTMLElement;
}

interface ButtonType {
    new(prop: PropType): ButtonType;
    setDisabled: (arg: boolean) => void;
    setType: (type: 'primary' | 'text' | 'link' | 'default') => void;
    render: (node: HTMLElement) => HTMLElement;
    onClick?: (event: MouseEvent) => any;
}

function Button(this: ButtonType, prop: PropType) {
    const { disabled = false, child, type = 'default', onClick, className, style, target } = prop;
    this.onClick = onClick;
    const but = dom('button', {
        target,
        style,
        className: className ? "gkh-button ".concat(className) : "gkh-button",
        child: child instanceof Node ? child : undefined, innerText: 'string' == typeof child ? child : undefined
    });
    this.setType = (arg) => {

    }
    but.onclick = (event: MouseEvent) => {
        if (this.onClick) {
            this.onClick(event);
        }
    }
    this.setDisabled = (arg) => {
        but.disabled = arg;
    }
    this.render = (node) => {
        if (node) {
            node.appendChild(but);
        }
        return but;
    }
    if (disabled) {
        this.setDisabled(disabled);
    }
    return this;
}

export default Button as unknown as ButtonType;